<template>
  <div>
    <el-form
      :model="listQuery"
      :rules="rules"
      ref="ruleForm"
      label-width="120px"
      class="demo-ruleForm"
    >
      <el-form-item label="修改类型名称" prop="name">
        <el-input v-model="listQuery.name"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm('ruleForm')">修改</el-button>
        <el-button @click="resetForm('ruleForm')">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import { updateProductAttr} from "@/api/product";
export default {
  name: "updateAttr",
  data: function () {
    return {
      listQuery:{
          name:'',
        
      },
      rules: {
          name: [
            { required: true, message: '请输入活动名称', trigger: 'blur' },
            { min: 3, max: 15, message: '长度在 3 到 15 个字符', trigger: 'blur' }
          ],
        }
    }
  },
  methods: {
       submitForm(formName) {
        this.$refs[formName].validate((valid) => {
          if (valid) {
           updateProductAttr({id:this.$route.params.id,name:this.listQuery.name}).then(res=>{
            console.log(res)
            if(res.status == 200){
              this.$message({
                message:'恭喜你，修改了一条商品信息',
                type:'success',
              })
              this.$router.push('/pms/productAttr')
            }
          })
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      },
      resetForm(formName) {
        this.$refs[formName].resetFields();
      }
  },
  mounted() {
    this.listQuery.name = this.$route.params.val
  },
};
</script>

<style>
</style>
